<template>
   <div class="wrap">
      <myHead title="简历详情"></myHead>
      <div class="content" :style="{height:$store.state.minHeight-1+'rem'}">
         <div class="head">
            <div class="head-l">
               <p>张晓明&ensp;|&ensp;JAVA开发</p>
               <p>20岁·本科&ensp;|&ensp;5年工作经验&ensp;|&ensp;北京</p>
               <p>期望薪资：13-15k/月</p>
               <p><img src="../../../static/img/jl001.png" alt=""><span>13891049125</span></p>
               <p><img src="../../../static/img/jl002.png" alt=""><span>随时到岗&ensp;|&ensp;全职</span></p>
            </div>
            <div class="head-r">
               <img src="../../../static/img/uhead.jpg" alt="" class="head-r-img">
               <p @click="call('17391751754')">拨打</p>
            </div>
         </div>
         <div class="grys">
            <div class="grys-tit">个人优势</div>
            <div class="grys-box">
               <p>1、经验丰富，工作认真，工作能力强。</p>
               <p>2、有什么个人优势呢？用一两句话表述吧.经验丰富，工作 认真。经验丰富，工作认真。</p>
               <p>1、有什么个人优势呢？用一两句话表述吧.经验丰富，工作 认真。用一两句话表述吧.经验丰富，工作认真。。</p>
            </div>
         </div>
         <div class="gzjl">
            <div class="grys-tit">工作经历</div>
            <div class="gzjl-box">
               <div class="gzjl-tit">
                  <p>******科技有限公司</p>
                  <p>2020暑假</p>
               </div>
               <p class="gzjl-tit-smle">设计师</p>
               <div class="grys-box">
                  <p>1、你做的什么工作呀！描述一下工作内容吧~</p>
                  <p>2、工作内容记得要写哦，增加就业几率。</p>
               </div>
            </div>
            <div class="gzjl-box">
               <div class="gzjl-tit">
                  <p>******科技有限公司</p>
                  <p>2020暑假</p>
               </div>
               <p class="gzjl-tit-smle">设计师</p>
               <div class="grys-box">
                  <p>1、你做的什么工作呀！描述一下工作内容吧~</p>
                  <p>2、工作内容记得要写哦，增加就业几率。</p>
               </div>
            </div>
         </div>
         <div class="gzjl" style="border: none">
            <div class="grys-tit">教育经历</div>
            <div class="gzjl-box">
               <div class="gzjl-tit">
                  <p>郑州大学</p>
                  <p>2016-2019</p>
               </div>
               <p class="gzjl-tit-smle" style="font-weight: 400">本科，计算机</p>
            </div>
         </div>
      </div>
      <footer>
         <p>拒绝</p>
         <p>通过</p>
      </footer>
   </div>
</template>

<script>
    import myHead from "../../components/ClientComponents/lib/myHead"

    export default {
        name: "twHandsDeliveryDetails",
        components:{
            myHead
        },
        data(){
            return {

            }
        },
        methods:{
            call(phone){
                // 调用拨号功能
                window.location.href = 'tel://' + phone;
            },
        }
    }
</script>

<style scoped>
   .wrap {
      padding-top: .5rem;
   }
   .content {
      padding: .1rem;
      box-sizing: border-box;
      overflow-x: hidden;
   }
   .head {
      display: flex;
      flex-flow: row;
      align-items: flex-start;
      border-bottom: .01rem solid #EEEEEE;
      padding-bottom: .15rem;
      margin-bottom: .1rem;
   }
   .head-l {
      width: calc(100% - .9rem);
   }
   .head-l>p>img {
      width: .12rem;
      max-height: .16rem;
      margin-right: .1rem;
   }
   .head-l>p {
      font-size:.13rem;
      font-family:PingFang SC;
      font-weight:400;
      color: #333333;
      margin-bottom: .07rem;
      display: flex;
      flex-flow: row;
      align-items: center;
   }
   .head-l>p:nth-child(1) {
      font-size:.16rem;
   }
   .head-r {
      width: .9rem;
      display: flex;
      flex-flow: column;
      align-items: center;
   }
   .head-r-img {
      width: .7rem;
      height: .7rem;
      border-radius: 50%;
      margin-bottom: .15rem;
   }
   .head-r>p {
      width:.58rem;
      height:.25rem;
      background:rgba(255,255,255,1);
      border:.01rem solid rgba(255, 108, 10, 1);
      border-radius:.13rem;
      color: #FF6C0A;
      font-size:.13rem;
      font-family:Source Han Sans CN;
      font-weight:400;
      line-height: .25rem;
      text-align: center;
   }
   .grys,.gzjl {
      border-bottom: .01rem solid #EEEEEE;
      padding-bottom: .15rem;
      margin-bottom: .1rem;
   }
   .grys-tit {
      font-size:.15rem;
      font-family:PingFang SC;
      font-weight:500;
      color: #333333;
      line-height: .3rem;
   }
   .grys-box>p {
      font-size:.13rem;
      font-family:PingFang SC;
      font-weight:400;
      color: #333333;
      line-height: .24rem;
   }

   .gzjl-tit {
      height: .3rem;
      display: flex;
      flex-flow: row;
      align-items: center;
      justify-content: space-between;
   }
   .gzjl-tit>p {
      font-size:.13rem;
      font-family:PingFang SC;
      font-weight:400;
      color: #333333;
   }
   .gzjl-tit-smle {
      font-size:.12rem;
      font-family:PingFang SC;
      font-weight:500;
      color: #333333;
      line-height: .2rem;
   }
   .gzjl-box {
      margin-bottom: .1rem;
   }
   .gzjl-box:nth-last-child(1) {
      margin-bottom: 0;
   }

   footer {
      width: 100%;
      height: .5rem;
      background-color: #FFFFFF;
      position: fixed;
      left: 0;
      bottom: 0;
      display: flex;
      flex-flow: row;
      align-items: center;
      box-sizing: border-box;
      padding: 0 .1rem;
      justify-content: space-between;
   }
   footer>p:nth-child(1) {
      width:1.29rem;
      height:.38rem;
      box-sizing: border-box;
      border:.01rem solid rgba(255,126,46,1);
      border-radius:.05rem;
      font-size:.14rem;
      font-family:PingFang SC;
      color: #FF7E2E;
      text-align: center;
      line-height: .38rem;
   }
   footer>p:nth-child(2) {
      width:2.1rem;
      height:.38rem;
      background:rgba(255,126,46,1);
      border-radius:.05rem;
      color: #FFFFFF;
      text-align: center;
      line-height: .38rem;
   }
</style>